<template>
<div>
  <!--    返回导航栏-->
  <van-nav-bar
    title="登录"
    left-text="返回"
    left-arrow
    right-text="注册"
    @click-left="onClickLeft"
    @click-right="onClickRight"
  />
  <van-form @submit="onSubmit" class="login">
    <van-cell-group inset>
      <van-field
        v-model="ruleForm.name"
        name="username"
        label="用户名"
        placeholder="用户名"
        :rules="[{ required: true, message: '请填写用户名' }]"
      />
      <van-field
        v-model="ruleForm.password"
        type="password"
        name="password"
        label="密码"
        placeholder="密码"
        :rules="[{ required: true, message: '请填写密码' }]"
      />
    </van-cell-group>
    <div style="margin: 16px;">
      <van-button round block type="primary" native-type="submit">
        提交
      </van-button>
    </div>
  </van-form>
</div>
</template>

<script>

export default {
  name: "classify",
  data() {
    return {
      ruleForm:{
        name:'',
        password:''
      }
    }
  },
  methods:{
    onSubmit(values){
      console.log('submit', values);
      this.$axios.post('user/login',this.ruleForm).then(
        resp=> {
          console.log("xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx")
          console.log(resp)
          console.log("xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx")
          if(resp.data.result){
            console.log(resp.data.data.roleId)
            window.localStorage.setItem("id", JSON.stringify(resp.data.data.userId))
            window.localStorage.setItem("username", JSON.stringify(resp.data.data.username))
            window.localStorage.setItem("Authorization", JSON.stringify(resp.data.data.Authorization))
            this.$router.push("/home")
          }
        }
      )
    },
    onClickLeft(){
      this.$router.back()
    },
    onClickRight(){
      this.$router.push("/register")
    }
  }
}
</script>

<style scoped>
.login{
  margin: auto;
  width: 6rem;
  margin-top: 30vh;
}
</style>
